import { computed, ref } from 'vue';
import { resolveAspectRatio } from '../utils';
export const swiperProps = {
    customStyle: [String, Object],
    current: {
        type: Number,
        default: 0,
    },
    // 切换的动画时间
    duration: {
        type: Number,
        default: 300,
    },
    aspectRatio: {
        type: [Number, String],
        default: 2.7,
    },
    list: {
        type: Array,
        default: () => [], // [{ cover: string, ... }]
    },
    loop: Boolean,
    autoplay: {
        type: Number,
        default: 3500,
    },
    // 风格，1-常规，2-一屏3个，左右露出相邻 item 的小部分
    type: {
        type: Number,
        default: 1,
    },
    /**
     * 仅小程序有用
     */
    showMenuByLongpress: {
        type: Boolean,
        default: false,
    },
    innerRadius: [String, Number],
    // 是否显示指示器
    indicator: {
        type: Boolean,
        default: true,
    },
    // 当前选中的指示点颜色
    indicatorActiveColor: {
        type: String,
        default: 'var(--fan-primary-color)',
    },
    // 支付宝小程序无法通过 slots.default 自动判断，此时需要该属性 https://ask.dcloud.net.cn/question/136765
    // 是否自定义 item 模板，即使用插槽
    customItem: {
        type: Boolean,
        default: false,
    },
    autoHeight: {
        type: Boolean,
        default: false,
    },
    //开启纵向滑动
    vertical: {
        type: Boolean,
        default: false,
    },
};
export const swiperEmits = ['click', 'update:current', 'change'];
export const useSwiperState = (props) => {
    // 容器宽度，type 为2时用到
    const swiperWidth = ref(375);
    // 整体轮播盒子的宽高比，type=2 时 不 等于图片的宽高比
    const swiperAspectRatio = computed(() => {
        const { type, aspectRatio, autoHeight } = props;
        if (autoHeight)
            return 0;
        const ar = resolveAspectRatio(aspectRatio);
        if (type !== 2)
            return ar;
        const w = swiperWidth.value;
        // 左右 margin：38 * 2 = 76
        // 整体盒子和图片 宽度相差 76，高度相等，得以计算盒子宽高比
        return w / ((w - 76) / ar);
    });
    return { swiperWidth, swiperAspectRatio };
};
